<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <!-- 商家列表 -->
    <meta charset="UTF-8">
    <title>技术服务商家列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <link rel="stylesheet" href="./css/domain.css">
    <link href="css/newStyle.css" rel="stylesheet">
    <!-- 弹窗轻提示 -->
    <link href="css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <script src="js/plugins/sweetalert/sweetalert.min.js"></script>
    <!-- 引入jq -->
    <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>
    <script src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script type="text/javascript" src="./js/common.js"></script>
    <!-- <script type="text/javascript" src="./js/domain.js"></script> -->

    <!--[if lt IE 9]>
          <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
          <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
</head>
<style>
    tbody tr {
        height: 120px !important;
    }

    .laytable-cell-1-0-2,
    .laytable-cell-1-1-2,
    .laytable-cell-1-2-2,
    .laytable-cell-1-3-2,
    .laytable-cell-1-4-2,
    .laytable-cell-1-5-2,
    .laytable-cell-1-6-2,
    .laytable-cell-1-7-2,
    .laytable-cell-1-8-2,
    .laytable-cell-1-9-2,
    .laytable-cell-1-10-2,
    .laytable-cell-1-11-2 {
        height: 100% !important;
    }

    tr td:nth-child(3) .layui-table-cell {
        height: 100% !important;
    }

    /* tr td.layui-table-col-special{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    } */
</style>

<body>
    <div class="x-nav">
        <!-- <span class="layui-breadcrumb"> -->
        <span class="goods_name">商家列表</span>
        <!-- </span> -->
        <a class=" layui-btn-small goodsRoload" style="line-height:1.6em;margin-top:3px;" onclick="location.reload()"
            title="刷新">
            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i> 刷新
        </a>
    </div>
    <!-- 商品列表数据 -->
    <div class="nav">
        <ul class="nav-navigation">
            <li class="nav-active"><i style="font-style: normal;">全部商家</i>(<span id="allNumber">
                </span>)</li>
            <!-- 这里用自定义属性获取不到 -->
            <li><i style="font-style: normal;">已上架</i>(<span id="shangjia"> </span>)</li>
            <li><i style="font-style: normal;">未上架</i>(<span id="xiajia"> </span>)</li>
            <li><i style="font-style: normal;">待审核</i>(<span id="daishenhe"> </span>)</li>
            <li><i style="font-style: normal;">未通过</i>(<span id="weitongguo"> </span>)</li>
        </ul>
    </div>
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <!-- 头部筛选部分 -->
                    <div class="layui-card-body ">
                        <!-- 筛选条件 -->
                        <div class="search">
                            <div class="search_if">
                                <span>
                                    <i class="layui-icon" style="font-size:20px"> &#xe615;</i>
                                    筛选条件
                                </span>
                                <p class="choose_up" id="down"> <span><i class="layui-icon">&#xe619;</i>收起筛选</span></p>
                                <p class="choose_up" hidden id="up"><span><i class="layui-icon">&#xe61a;</i>展开筛选</span>
                                </p>
                            </div>
                        </div>
                        <div class="search_row">
                            <form class="layui-form layui-col-space5">
                                <span> 商家编号：</span>
                                <div class="layui-inline layui-show-xs-block">
                                    <input type="text" name="userName" placeholder="商家编号" autocomplete="off"
                                        class="layui-input input_height">
                                </div>
                                <span>商家名称：</span>
                                <div class="layui-inline layui-show-xs-block">
                                    <div class="layui-input-inline">
                                        <input type="text" name="userNum" placeholder="商家名称" autocomplete="off"
                                            class="layui-input input_height">
                                        <!-- <select name="categories" id="categories"  lay-verify="required" lay-filter="categories" lay-search="">
                                            <option value="">直接选择或搜索选择</option>
                                        </select> -->
                                    </div>
                                </div>
                                <!-- <span> 商品品牌：</span>
                                <div class="layui-inline layui-show-xs-block">
                                    <div class="layui-input-inline">
                                        <select name="productBrand" id="productBrand" lay-filter="productBrand"
                                            lay-search="">
                                            <option value="">直接选择或搜索选择</option>
                                        </select>
                                    </div>
                                </div> -->

                                <div class="layui-inline layui-show-xs-block submit_btn">
                                    <!-- <span id="result_list">查询结果</span> -->
                                    <button class="layui-btn layui-btn-primary" lay-submit="" lay-filter="sreach"
                                        type="button">
                                        查询结果</button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="layui-card-body ">
                        <!-- 数据列表 -->
                        <div class="user_list">
                            <img src="./images/icon.png" alt="数据表格">
                            <span>数据列表</span>
                        </div>
                        <table id="demo" lay-filter="test">

                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script>
    //  操作筛选条件的收起展开
    $('.choose_up').on('click', function () {
        $('.search_row').toggle();
        $('#up').toggle();
        $('#down').toggle()
    })
</script>
<script type="text/html" id="toolbarDemo">
        <!-- <div class = "layui-btn-container" > 
            <button class = "layui-btn-danger layui-btn layui-btn-xs" lay-event = "del" ><i class="layui-icon">&#xe640;</i>批量删除</button>
            <button class="layui-btn" onclick="xadmin.open('添加用户','./member-add.html',1200,720)"><i class="layui-icon"></i>添加</button>
            <button class = "layui-btn layui-btn-sm" lay-event = "getCheckData" > 获取选中行数据 </button>
            <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button > 
            <button class = "layui-btn layui-btn-sm" lay-event = "isAll" > 验证是否全选</button>
        </div >  -->
    </script>
<script type="text/html" id="switchTpl">
        <input type = "checkbox" name = "sex" value = "{{d.id}}" lay-skin = "switch"lay-text = "女|男" lay-filter = "sexDemo" {{ d.id == 10003 ? 'checked': ''}} >
    </script>
<script type="text/html" id="skuS">
        <a title="编辑"  onclick="xadmin.open('编辑货品信息',('skuEdit.html?goods_num='+{{d.goods_num}}),960,720
        )" href="javascript:;">
            <i class="layui-icon">&#xe642;</i>
          </a>
    </script>

<!-- <script type="text/html" id="imgS">
     
    <img src=(imgUrl+"{{d.store_pic}}")  onclick="previewImg(this)" style="width:100px; height:100px;  ">
</script> -->
<script type="text/html" id="switchS">
        上架：<input type = "checkbox" name = "sex" value = "{{d.id}}" lay-skin = "switch" lay-filter = "sexDemo" {{ d.store_state == 1 ? 'checked': ''}} >
    </script>
<!-- <script type="text/html" id="btnS">
        <a title="查看"  onclick="xadmin.open('查看','businessEdit.html?id='+{{d.id}},1200,650)" href="javascript:;">
            <i class="layui-icon" style="color: #1abc9c;">查看</i>
          </a>
      
    </script> -->
<!-- <script type="text/html" id="approvalStatus">
        {{#  if(d.store_status == 2){ }}
            <span style="color: #01AAED;">审核通过</span> &nbsp;
            <a title="审核详情"  href="javascript:;">
      
            </a>
        {{#  } else if(d.store_status == 1){ }}
        <span style="color: #ff9800;">待审核</span>&nbsp;
        {{#  } else if(d.store_status == 3) { }}
        <span style="color: red;">审核不通过</span>&nbsp;
        <a title="审核详情"  href="javascript:;">
 
        {{#  } }}
    </script> -->
<script type="text/html" id="goods_price">
		<span title={{d.goods_price}}>{{d.goods_price}}</span>/<span title={{d.goods_num}}>{{d.goods_num}}</span>
	</script>
<script>layui.use('laydate',
        function () {
            var laydate = layui.laydate;

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });

        });</script>
<script>layui.use(['layedit', 'laydate', 'table', 'form'],
        function () {
            var table = layui.table
                , form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate
                , $ = layui.jquery

            //   上方点击筛选数据的渲染
            function initial() {
                $.ajax({
                    type: 'get',
                    headers: {
                        'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                    },
                    url: urls + 'smallStore/storePageTotalCount',
                    data: { type: 2 },
                    success: function (res) {
                        CheckLogout(res); //检查是否登陆过
                        if (res.code == 0) {
                            $('#allNumber').text(res.data.allNumber)
                            $('#shangjia').text(res.data.shangjia)
                            $('#xiajia').text(res.data.xiajia)
                            $('#daishenhe').text(res.data.daishenhe)
                            $('#weitongguo').text(res.data.weitongguo)
                        }
                    }
                })
            }
            initial(); //初步渲染
            // 上面筛选条件
            //  点击筛选导航功能   
            $('.nav-navigation li').on('click', function () {
                // 拿到当前的数据（需要传的参数）
                // 如果有这个类名的就停止执行
                if ($(this).hasClass("nav-active")) {
                    return
                }
                $('.nav-navigation li').removeClass("nav-active");
                $(this).addClass("nav-active");
                var data = $(this).children('i').text() //拿到当前值
                // 发送异步请求,传参,重新渲染表格
                // 判断点击的筛选按钮
                var name;
                if (data == '已上架') {
                    name = 1;
                    var idx = 1;
                } else if (data == "未上架") {
                    name = 1;
                    var idx = 0;
                } else if (data == '待审核') {
                    name = 2;
                    var ids = 1;
                } else if (data == '未通过') {
                    name = 2;
                    var ids = 3;
                } else if (data == '全部商家') {
                    name = 2;
                    var ids = '';
                }
                if (name == 1) {
                    // 重新加载数据
                    table.reload('idTest', {
                        url: urls + 'smallStore/querySmallStoreList',
                        headers: {
                            'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                        },
                        page: {
                            curr: 1 //重新从第 1 页开始
                        },
                        where: {
                            storeStatus: '',
                            storeState: idx,
                            storeCode: '',
                            storeName: ''
                            // token: token
                        } //传递参数
                    });
                } else if (name == 2) {
                    // 数据初始化
                    // 数据重载
                    table.reload('idTest', {
                        url: urls + 'smallStore/querySmallStoreList',
                        headers: {
                            'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                        },
                        page: {
                            curr: 1 //重新从第 1 页开始
                        },
                        where: {
                            storeState: '',
                            storeStatus: ids,
                            storeCode: '',
                            storeName: ''
                            // token: token
                        }   //传递参数
                    });
                }
            });

            //点击按钮监听提交事件 点击按钮实现筛选功能
            form.on('submit(sreach)', function (data) {
                // console.log(data.field,'提交的数据')
                // table数据重新渲染(拿到后台接口)   点击搜索
                table.reload('idTest', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                    headers: {
                        'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                    },
                    where: {
                        storeCode: data.field.userName,
                        storeName: data.field.userNum,
                        // token: token
                    },//传递参数
                });
                return false;
            });
            //监听单元格编辑
            table.on('edit(test)',
                function (obj) {
                    var value = obj.value //得到修改后的值
                        ,
                        data = obj.data //得到所在行所有键值
                        ,
                        field = obj.field; //得到字段
                    layer.msg('[ID: ' + data.id + '] ' + field + ' 字段更改为：' + value);
                });

            // 封装初始化加载table
            function init() {
                Showload();
                //第一个实例
                table.render({
                    elem: '#demo'
                    , toolbar: '#toolbarDemo'
                    , cellMinWidth: 80
                    // , where: { type : 1 }
                    , url: urls + 'smallStore/querySmallStoreList' //数据接口
                    , headers: {
                        'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                    }
                    , where: {
                        storeState: '',
                        verifyResult: '',
                        storeStatus: '',
                        type: 2
                    }
                    , method: 'get' //如果无需自定义HTTP类型，可不加该参数
                    , page: true //开启分页
                    , parseData: function (res) { //res 即为原始返回的数据
                        // console.log(res, 889999)
                        CheckLogout(res); //检查是否登陆过
                        return {
                            "code": res.code, //解析接口状态
                            "msg": res.msg, //解析提示文本
                            "count": res.data.total, //解析数据长度
                            "data": res.data.records //解析数据列表
                        }
                    }
                    , id: 'idTest'
                    , cols: [[ //表头
                        { field: 'id', title: 'ID', type: 'checkbox', fixed: 'left', align: 'center' },
                        { field: 'id', title: '编号', align: 'center', width: 80 }
                        // , { field: '', templet: '#imgS', title: '商家图片', align: 'center' }
                        , {
                            field: 'store_pic', title: '商家图片', align: 'center', templet: function (res) {
                                return '<img src=' + imgUrl + res.store_pic + ' style="width:100px; height:100px;  class="layui-upload-img" onclick="previewImg(this)">'
                            }
                        }
                        , { field: 'store_name', title: '商家名称', align: 'center' }
                        , { field: 'store_cert_email', title: '商家邮箱', align: 'center', width: 260 }
                        , { field: '', title: '标签', templet: '#switchS', align: 'center' }
                        , { field: 'sort', title: '排序', align: 'center', width: 80 }
                        , { field: 'store_name', title: '联系人', align: 'center' }
                        , { field: 'store_cert_phone', width: 180, title: '联系电话', align: 'center' }
                        , { field: '', width: 180, title: '审核状态', templet: '#approvalStatus', align: 'center' }

                        , {
                            fixed: 'right', field: 'store_status', width: 152, align: 'center', align: 'center', title: "操作", templet: function (res) {
                                if (res.store_status == 2) {
                                    return '<a lay-event="look_goods" ><i class="layui-icon" style="font-size:20px;  color : #1abc9c; font-size: 12px;" title="查看">查看</i> </a> '
                                } else if (res.store_status == 3) {
                                    return ' <a lay-event="goods_check"><i class="layui-icon" style="font-size:20px; margin-right: 10px; color : #1abc9c; font-size: 12px" title="审核"> 审核</i> </a>   <a lay-event="look_goods" ><i class="layui-icon" style="font-size:20px; margin-right: 10px; color : #1abc9c; font-size: 12px;" title="查看">查看</i> </a><a lay-event="business_del" ><i class="layui-icon" style="font-size:20px; margin-right: 10px; color : #1abc9c; font-size: 12px;" title="查看">删除</i> </a> ';
                                } else {
                                    return ' <a lay-event="goods_check"><i class="layui-icon" style="font-size:20px; margin-right: 10px; color : #1abc9c; font-size: 12px" title="审核"> 审核</i> </a>   <a lay-event="look_goods" ><i class="layui-icon" style="font-size:20px; margin-right: 10px; color : #1abc9c; font-size: 12px;" title="查看">查看</i> </a> ';
                                }

                            }
                        }
                    ]]
                    , done: function (res, curr, count) {
                        //如果是异步请求数据方式，res即为你接口返回的信息。
                        if (res.code == 0) {
                            InitTime();
                        } else {
                            TipsAlert("请求数据失败,请联系后台技术人员");
                        }
                    }
                });
            }
            init();

            // 监听layui开关上下架事件

            //开关事件(status是lay-filter中的status，注意区别)
            form.on('switch(sexDemo)', function (obj) {
                console.log(obj, 123)
                // 通过属性获取绑定的id值
                var storeId = obj.value;
                var status = obj.elem.checked ? "1" : "2";
                // 构造请求参数对象
                if (status == 1) {   //点击上架
                    //ajax请求方法
                    $.ajax({
                        url: urls + 'smallStore/updateStoreStateTop',
                        headers: {
                            'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                        },
                        type: "post",
                        data: { storeId: storeId },
                        success: function (data) {
                            // console.log(data,'上架')
                            CheckLogout(data); //检查是否登陆过
                            if (data.code == 0) {
                                swal({
                                    title: "已上架",
                                    type: "success",
                                });
                                initial();
                            } else {
                                layer.msg("修改失败", { icon: 6 });
                            }
                        }
                    });
                } else {    //点击下架
                    //ajax请求方法
                    $.ajax({
                        url: urls + 'smallStore/updateStoreStateDown',
                        headers: {
                            'X-Access-Token': JSON.parse(sessionStorage.getItem("user_message")).token,
                        },
                        type: "post",
                        data: { storeId: storeId },
                        async: false,
                        success: function (data) {
                            // console.log(data,'下架')
                            CheckLogout(data); //检查是否登陆过
                            if (data.code == 0) {
                                swal({
                                    title: "已下架",
                                    type: "success",
                                });
                                // 修改上方数据渲染
                                initial();
                            } else {
                                layer.msg("修改失败", { icon: 6 });
                            }
                        }
                    });
                }
            })

            // 表格相关操作
            //审核的状态操作 删除
            //监听行单击事件 (删除和查看功能)
            table.on('tool(test)', function (obj) {
                // obj为单行数据对象
                var data = obj.data;
                obj.tr.addClass("active_tr").siblings().removeClass("active_tr");  //标注选中行样式
                // 监听单行删除功能
                if (obj.event === 'business_del') {    //删除功能
                    layer.confirm('真的删除行么', function (index) {
                        $.post(urls + 'smallStore/deleteStoreId', {storeId : obj.data.id }, function (rsp) {
                            if (rsp && rsp.code == 0) {
                                initial(); //重新渲染上方数据
                                layer.msg('删除成功');
                                obj.del();
                                layer.close(index);
                            } else {
                                if (rsp && rsp.msg) {
                                    layer.alert(rsp.msg);
                                }
                                else {
                                    layer.alert('删除失败');
                                }
                            }
                        }, 'json');
                    });
                } else if (obj.event === 'goods_check') {  //审核功能
                    // 如果审核通过,则不在审核
                    // if (data.store_status == 2) {
                    //     layer.alert("该商家已经审核通过！", {
                    //         icon: 6
                    //     })
                    //     return;
                    // }
                    // console.log(obj.data)
                    layer.open({
                        type: 2,
                        title: '',
                        content: `./businessCensor.html?id=${obj.data.id}`,
                        area: ['1200px', '720px'],
                        btn: ['返回'],
                        end: function () {
                            // console.log(12345)
                            table.reload('idTest', {
                                page: {
                                    curr: $(".layui-laypage-em").next().html() //加载当前页
                                }
                            });
                            // 审核通过后，上方数据重新渲染
                            initial();
                        }

                    });
                } else if (obj.event === 'look_goods') {   //查看详情功能
                    // console.log(obj.data.id,'查看id') 
                    layer.open({
                        type: 2,
                        title: '',
                        content: './businessEdit.html?id=' + obj.data.id,
                        area: ['1200px', '720px'],
                        btn: ['返回']
                    });
                }
            });
        });
</script>
<script>var _hmt = _hmt || []; (function () {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();</script>

<script>
    /*用户-删除*/
    // function member_del(obj, id) {
    //     layer.confirm('确认要删除吗？', function (index) {
    //         //发异步删除数据
    //         $(obj).parents("tr").remove();
    //         layer.msg('已删除!', { icon: 1, time: 1000 });
    //     });
    // }

    function previewImg(obj) {
        var img = new Image();
        img.src = obj.src;
        //var height = img.height + 50; // 原图片大小
        //var width = img.width; //原图片大小
        var imgHtml = "<img src='" + obj.src + "' width='500px' height='500px'/>";
        //弹出层
        layer.open({
            type: 1,
            shade: 0.8,
            offset: 'auto',
            area: [500 + 'px', 550 + 'px'],  // area: [width + 'px',height+'px']  //原图显示
            shadeClose: true,
            scrollbar: false,
            title: "图片预览", //不显示标题  
            content: imgHtml, //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响  
            cancel: function () {
                //layer.msg('捕获就是从页面已经存在的元素上，包裹layer的结构', { time: 5000, icon: 6 });  
            }
        });
    }


</script>

</html>